✮ Marissa Barch ✮

Summary 5

CSS Flexbox

CSS flexbox is the new way to style to make it flexible without using float or positioning. In order to create one you need a flexbox container. This will help define the layout of the flexbox. Before flexboxes there were different various like inline, block, table, and position.       

 

CSS Flexbox Container

The CSS flexbox container becomes flexible with including "display: flex". By doing this you can rearrange your boxes more than you could in the past. You can make the boxes stack or switch the directions of them or put them side by side one another too. You can also change if it has a wrap or where it is align on the page or if they are aligned on the baseline   

 

CSS Flexbox Items

The CSS flexbox items are the boxes included in the flexbox container. Making sure you keep them in order in the CSS of how you want them to be is important because thats the order they will show up as. Flex-grow or flex-grow properties determines how much the item will move depending on how you set it while flex-basis will determine the length.